<template>
	<div>
	<view class="login_from">
		<view class="login_from_input">
			<view class="login_from_name">用户名</view>
			<view class="login_from_fun">{{UserVo.userName}}</view>
		</view>	
		<view  class="login_from_input">
			<view class="login_from_name">头像</view>
			<image  :src="UserVo.userImage" mode="aspectFill" class="box"></image>
		</view>
		<view class="login_from_input">
			<view class="login_from_name">手机号</view>
			<view class="login_from_fun">{{UserVo.userPhone}}</view>
		</view>
		<view class="login_from_input">
			<view class="login_from_name">邮箱号</view>
			<view class="login_from_fun">{{UserVo.userEmail}}</view>
		</view>
		<view class="login_from_input">
			<view class="login_from_name">性别</view>
			<view v-if="UserVo.sex==0">男</view>
			<view v-if="UserVo.sex==1">女</view>
		</view>
		<view class="login_from_input">
			<view class="login_from_name">年龄</view>
			<view class="login_from_fun">{{UserVo.age}}</view>
		</view>
		<view class="login_from_input">
			<view class="login_from_fun" @click="personageUpdate">完善/修改个人的信息</view>
		</view>
	</view>
	</div>
</template>

<script>
	let caseTaskVo={"tid":0}
	export default {
			data() {
				return {
					imgSrc:'',
					UserVo:{
						userName:'',
						userPhone:'',
						userEmail:'',
						userImage:'',
						sex:'',
						age:'',
						userRole:''
					}
				}
			},
			onLoad() {
				this.handuserMessage()
			},
			methods:{
				personageUpdate(){
					uni.navigateTo({
						url: './index1'
					})
				},
				handuserMessage(){
					const value = uni.getStorageSync('userId');
					console.log(value)
					this.userId=value
					uni.request({
					    url: `http://localhost:7000/user/userMessage/${this.userId}`, //接口地址。
					    header: {
					        'custom-header': 'hello' //自定义请求头信息
					    },
						method:'POST',
					    success: (res) => {
					        console.log(res.data.data);
							this.UserVo=res.data.data
					    },
					})	
				},
				// uploadImg(){
				//     uni.chooseImage({
				//         count: 1, //默认9
				//         sizeType: ['original'], //可以指定是原图还是压缩图，默认二者都有
				//         sourceType: ['album'], //从相册选择
				//         success:res => {
				//             this.imgSrc=res.tempFilePaths[0]
				// 			console.log(this.imgSrc)
				//             //上传给后台
				//             uni.uploadFile({
				//                 url:`http://localhost:7000/user/updateFile`,
				//                 filePath: res.tempFilePaths[0],
				// 				name: 'file',
				//                 header: {
				//                     'Authorization': "hello"
				//                 },
				//                 success: (uploadFileRes) => {
				// 					console.log(uploadFileRes.data)
				//                     this.UserVo.userImage=uploadFileRes.data
				//                 }
				//             })
				//         }	
				//     });
				// }, 
			}
		}
</script>

<style>
	
	page{ background: #fff; }
	
	.login_img{ width: 100%; height: auto; margin-top: 90upx; }
	.login_img image{ width: 170upx; height: 170upx; display: block; margin: 0px auto; border-radius: 50%; }
	
	.login_from{ width: 100%; height: auto; box-sizing: border-box; padding: 20upx 8%; }
	
	.login_from_input{ width: 100%; height:auto; display: flex; flex-direction: row; justify-content: space-between; align-items: center; border-bottom: 1px #eee solid; padding: 40upx 0px; margin: 0px auto;  } 
	
	.login_from_name{ width: 20%; }
	.login_from_fun{ width: 80%; display: flex; flex-direction: row; justify-content: flex-end; align-items: center;  }
	.login_from_fun input{ width: 100%; text-align: left; font-size: 14px;  }
	
	
	.login_from_dl{ width: 100%; height: 50px; line-height: 50px; margin-top: 150upx;   }
	.login_from_dl button{ width: 100%; height: 50px; line-height: 50px; background: #FF3B00; color: #fff; border-radius: 50px; }
	
	.logo_xieyi{ width: 100%; height: 40px; line-height: 40px; display: flex; flex-direction: row; margin-top: 30upx; align-items: center; color: #444; font-size: 14px; justify-content: center; }
	.logo_xieyi label{ font-size: 18px; margin-right: 1%; }
	
	.cuIcon-squarecheckfill{ color: #FF3B00; }
	.logo_text text{ color: #FF3B00; }
	
	.getyzm{ width: 60%; display: flex; flex-direction: row; justify-content: flex-end; color: #FF3B00; }
	.cuicon{ font-size: 18px; }  
	.box{
		display: flex;
	}
</style>